<script setup lang="ts">
import { ref } from 'vue'
interface Banner{
  targetId:number,
  imageUrl:string,
  typeTitle:string
}

interface BannerRes{
  code:number,
  banners:Banner[]
}

import axios from 'axios';
const num = ref(0)
const banners = ref<Banner[]>([])

axios.get<BannerRes>('https://zyxcl.xyz/music/api/banner')
  .then(res =>{
    banners.value = res.data.banners
    console.log(res.data)
  })

</script>

<template>
  <h1>首页</h1>

  <ul>
    <li v-for="item in banners" :key="item.targetId">
      <h1>{{ item.typeTitle }}</h1>
      <img :src="item.imageUrl" alt="">

    </li>
  </ul>


</template>

<style lang="scss" scoped>

</style>
